@charset "utf-8";
@import "reset";
body {
  background-color: #f1f3f4;
}
.warp {
  width: 100vw;
  height: 177.8667vw;
  margin: 0 auto;
  background-color: #eaebef;
  position: relative;
  // 页面名称
  .title {
    width: 100vw;
    height: 11.2vw;
    background-color: white;
    text-align: center;
    line-height: 11.2vw;
  }
  // 登录之后
  .login {
    width: 100vw;
    height: 37.0667vw;
    background: url(../imgs/beijing.png);
    background-size: 100vw 34.4vw;
    background-repeat: no-repeat;
    .top {
      width: 40vw;
      height: 17.0667vw;
      display: flex;
      margin: 0 auto;
      padding-top: 6.6667vw;
      .photo {
        width: 17.0667vw;
        height: 17.0667vw;
        border-radius: 8.5333vw;
        border: .5333vw solid #ffffff80;
        img {
          width: 100%;
          height: 100%;
          border-radius: 50%;
        }
      }
      .write {
        width: 18.72vw;
        height: 4.5333vw;
        line-height: 4.5333vw;
        color: #ffffffff;
        font-size: 3.7333vw;
      }
    }
    .bottom {
      width: 7.4667vw;
      height: 5.3333vw;
      line-height: 5.3333vw;
      color: #ffffffff;
      font-size: 3.7333vw;
      margin: 0 auto;
    }
  }
  // 我的订单部分
  .orders {
    width: 97vw;
    height: 31.7333vw;
    border-radius: 1.3333vw;
    margin: 0 auto;
    background: #ffffffff;
    .top {
      width: 89vw;
      height: 8.2667vw;
      border-bottom: .2667vw solid #e9ecf0ff;
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      padding-top: 4vw;
      .left {
        width: 14.9867vw;
        height: 4.5333vw;
        line-height: 4.5333vw;
        color: #555555ff;
        font-size: 3.7333vw;
      }
      .right {
        width: 17.704vw;
        height: 4.5333vw;
        line-height: 4.5333vw;
        color: #555555ff;
        font-size: 3.7333vw;
      }
    }
    .bottom {
      width: 89vw;
      height: 11.7333vw;
      margin: 0 auto;
      margin-top: 3.7333vw;
      display: flex;
      align-items: flex-end;
      justify-content: space-around;
      .one {
        width: 11.2vw;
        height: 5.3333vw;
        line-height: 5.3333vw;
        color: #555555ff;
        font-size: 3.7333vw;
      }
    }
  }
  // 设置部分
  .main {
    width: 97vw;
    height: 35.4667vw;
    border-radius: 1.3333vw;
    margin: 0 auto;
    margin-top: 1.3333vw;
    background: #ffffffff;
    .first {
      width: 89vw;
      height: 8.5333vw;
      margin: 0 auto;
      padding-top: 4vw;
      border-bottom: .2667vw solid #e9ecf0ff;
      .conntent {
        width: 12.8vw;
        height: 5.8667vw;
        line-height: 5.8667vw;
        color: #333333ff;
      }
    }
    .second {
      width: 89vw;
      height: 10.6667vw;
      margin: 0 auto;
      border-bottom: .2667vw solid #e9ecf0ff;
      .content {
        width: 17.0667vw;
        height: 5.8667vw;
        line-height: 5.8667vw;
        color: #333333ff;
        padding-top: 2vw;
      }
    }
    .third {
      width: 89vw;
      height: 8.2667vw;
      margin: 0 auto;
      .content {
        width: 8.5333vw;
        height: 5.8667vw;
        line-height: 5.8667vw;
        color: #333333ff;
        padding-top: 2vw;
      }
    }
  }
  .footer {
    width: 100vw;
    height: 13.5413vw;
    background-color: white;
    position: absolute;
    bottom: 0;
    .item {
      width: 72.2667vw;
      height: 4vw;
      margin: 0 auto;
      margin-top: 8.2667vw;
      display: flex;
      justify-content: space-between;
      .write {
        width: 6.4vw;
        height: 4vw;
        color: #333333ff;
        font-size: 3.2vw;
        line-height: 4vw;
      }
      .length {
        width: 9.6vw;
        height: 4vw;
      }
      .active {
        color: #884e22ff;
      }
    }
  }
}
